<template>
	<view class="refund">
		<view class="refund_item" @click="$linkTo('./AfterSaleDetails?refund_sn='+item.refund_sn)"  v-for="(item,index) in dataList" :key="index">
			<view class="item_top">
				<view class="top_left">
					{{$dateFormat(item.date_add*1000,'Y-m-d H:i')}}
				</view>
				<view class="top_right">{{item.refund_state_name}}</view>
			</view>
			<view class="item_content">
				<image :src="item.goods.cover||'/pagesB/static/微信图片_20201124091755.png'" mode=""></image>
				<view class="ItemContent">
					<view class="title">{{item.goods.name}}</view>
					<view class="parameter">
						<view class="parameter1">{{item.goods.option_name}}</view>
					</view>
					<view class="price_ctrlbox">
						<view class="price">￥{{$amountCvs(item.goods.price)}}</view>
						<view class="ctrlbox">x{{item.goods.quantity}}</view>
					</view>
				</view>
			</view>
			<view class="item_buttom">
				<view class="price">
					退款金额<text>￥{{$amountCvs(item.refund_price)}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				page:1,
				dataList:[]
			};
		},
		onLoad() {
			this.$request('/app/order/getRefundOrders','post',{
				access_token:uni.getStorageSync('access_token').replace(/^\"|\"$/g,''),
				page:this.page
			}).then(res=>{
				this.dataList=res.content
			})
		},
		methods:{
			
		}
	}
</script>

<style lang="less">
	.refund{
		height: 100%;
		padding-top: 20rpx;
		background-color: #F3F4F5;
		.refund_item{
			margin-bottom: 10rpx;
			background-color: #fff;
			.item_top{
				padding: 20rpx;
				display: flex;
				justify-content: space-between;
				border-bottom: 1px solid #eeeeee;
				.top_left{
					font-size: 24rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #111111;
				}
				.top_right{
					font-size: 24rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #DB1B22;
				}
			}
			.item_content {
				display: flex;
				padding: 20rpx;
				border-bottom: 1px solid #eeeeee;
				background-color: #fff;
				margin-bottom: 10rpx;
				image {
					height: 180rpx;
					width: 180rpx;
					margin-right: 16rpx;
				}
				.ItemContent {
					flex: 1;
					display: flex;
					flex-direction: column;
					justify-content: space-between;
					.title {
						height: 72rpx;
						font-size: 28rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #111111;
					}
					.parameter {
						height: 34rpx;
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #9da5a8;
					}
					.price_ctrlbox {
						display: flex;
						justify-content: space-between;
					}
					.price {
						font-size: 28rpx;
						font-family: PingFangSC-Medium, PingFang SC;
						font-weight: 500;
						color: #111111;
					}
					.ctrlbox {
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #9da5a8;
					}
				}
			}
			.item_buttom{
				padding: 20rpx;
				display: flex;
				flex-direction: row-reverse;
				.price{
					font-size: 24rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #111111;
					text{
						font-size: 32rpx;
						font-family: PingFangSC-Medium, PingFang SC;
						font-weight: 500;
						color: #111111;
					}
				}
			}
		}
	}
</style>
